import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import vueDevTools from 'vite-plugin-vue-devtools'

import postCssPxToRem from 'postcss-pxtorem'
import styleImport, { VantResolve } from 'vite-plugin-style-import'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    vueJsx(),
    vueDevTools(),
    styleImport({
      resolves: [VantResolve()],
      libs: [
        {
          libraryName: 'vant',
          esModule: true,
          resolveStyle: (name) => {
            if (name == 'show-toast') {
              return `../es/toast/style/index` //修改vant引入路径
            } else if (name == 'show-dialog') {
              return `../es/dialog/style/index` //修改vant引入路径
            } else {
              return `../es/${name}/style/index` //修改vant引入路径
            }
          }
        }
      ]
    })
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  css: {
    postcss: {
      plugins: [
        postCssPxToRem({
          // 配置在将px转化为rem时 1rem等于多少px(因为我们搭配使用了amfe-flexible插件 此处我们需要设置的值应是UI设计稿全屏基准宽度的十分之一)
          // 当UI设计稿的全屏基准宽度是750px时 此处设置的值为75 但项目中使用了vant组件库 vant的设计稿总宽度是375px 其十分之一应是37.5(需要区分设置)
          rootValue({ file }) {
            return file.indexOf('vant') !== -1 || file.indexOf('HomeTwo') !== -1 ? 37.5 : 75
          },
          // 所有px均转化为rem
          propList: ['*']
          // 若想设置部分样式不转化 可以在配置项中写出
          // eg: 除 border和font-size外 所有px均转化为rem
          // propList: ["*", "!border","!font-size"],
        })
      ]
    }
  },
  optimizeDeps: {
    include: ['axios']
  },
  build: {
    target: 'modules',
    outDir: 'dist',
    assetsDir: 'assets',
    minify: 'terser' // 混淆器
  },
  server: {
    cors: true,
    open: true,
    proxy: {
      '/api': {
        target: 'http://127.0.0.1:9968', //代理接口
        // target: 'https://jifen.muziyueyueniao.top',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      }
    }
  }
})
